import React from 'react';
import {Route, Link, Switch, Redirect} from 'react-router-dom';
import {AOne} from "./loop-child/AOne";
import {ATwo} from "./loop-child/ATwo";
import {AThree} from "./loop-child/AThree";

export const A = function () {
    return (
        <>
            <div>
                <Link to='/a/a1'>a1</Link>
            </div>
            <div>
                <Link to='/a/a2'>a2</Link>
            </div>
            <div>
                <Link to='/a/a3'>a3</Link>
            </div>

            <div>
                <Switch>
                    {/*默认显示a1，path中的上级路由地址不能省*/}
                    <Redirect exact from={'/a'} to='/a/a1' />
                    <Route path='/a/a1' component={AOne} />
                    <Route path='/a/a2' component={ATwo} />
                    <Route path='/a/a3' component={AThree} />
                </Switch>
            </div>
        </>
    )

};